<%--
  Created by IntelliJ IDEA.
  User: 11965
  Date: 2020/9/11
  Time: 8:46
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@taglib prefix="fm" uri="http://www.springframework.org/tags/form" %>
<%@include file="../header.jsp"%>
<script src="statics/calendar/WdatePicker.js"></script>


<c:if test="${requestScope.insertFlag > 0}">
    <script>
        alert("添加成功")
        window.location = "toUserlist"
    </script>
</c:if>
<c:if test="${requestScope.insertFlag == 0}">
    <script>
        alert("添加失败")
    </script>
</c:if>


<div class="right">
    <div class="location">
        <strong>你现在所在的位置是:</strong>
        <span>用户管理页面 >> 用户添加页面</span>
    </div>
    <div class="providerAdd">
        <form id="userForm" name="userForm" method="post" action="userAdd" enctype="multipart/form-data">
        <%--<fm:form method="post" action="userAdd" modelAttribute="u">--%>
            <div>
                <label for="userCode">用户编码：</label>
                <input type="text" name="usercode" id="userCode" value="">
                <%--<fm:input path="usercode"></fm:input>--%>
                <!-- 放置提示信息 -->
                <font color="red">
                    <%--<fm:errors path="usercode"></fm:errors>--%>
                </font>
            </div>
            <div>
                <label for="userName">用户名称：</label>
                <input type="text" name="username" id="userName" value="">
                <font color="red"></font>
            </div>
            <div>
                <label for="userPassword">用户密码：</label>
                <input type="password" name="userpassword" id="userPassword" value="">
                <font color="red"></font>
            </div>
            <div>
                <label for="ruserPassword">确认密码：</label>
                <input type="password" name="ruserPassword" id="ruserPassword" value="">
                <font color="red"></font>
            </div>
            <div>
                <label >用户性别：</label>
                <select name="gender" id="gender">
                    <option value="1" selected="selected">男</option>
                    <option value="0">女</option>
                </select>
            </div>
            <div>
                <label for="birthday">出生日期：</label>
                <input type="text" Class="Wdate" id="birthday" name="birthday"
                       readonly="readonly" onclick="WdatePicker();">
                <font color="red"></font>
            </div>
            <div>
                <label for="phone">用户电话：</label>
                <input type="text" name="phone" id="phone" value="">
                <font color="red"></font>
            </div>
            <div>
                <label for="address">用户地址：</label>
                <input name="address" id="address"  value="">
            </div>
            <div>
                <label >用户角色：</label>
                <!-- 列出所有的角色分类 -->
                <select name="role.id" id="userRole"></select>
                <font color="red"></font>
            </div>

            <div>
                <label for="a_idPicPath">证件照：</label>
                <input type="file" name="cardphotoFile" id="a_idPicPath"/>
                <font color="red"></font>
            </div>
            <div>

                <label for="a_workPicPath">工作证照片：</label>
                <input type="file" name="workphotoFile" id="a_workPicPath"/>
                <font color="red"></font>
            </div>
            <div class="providerAddBtn">
                <input type="button" name="add" id="add" value="保存" >
                <input type="button" id="back" name="back" value="返回" >
            </div>
        </form>
        <%--</fm:form>--%>
    </div>
</div>
</section>

<script>
    $(function(){
        bindRole()
        bindEvent()
    })

    function bindRole(){
        //ajax请求 type=post
        //第一个参数为请求地址
        //第二个参数为请求的参数列表 （有则写，没有不写）
        //第三个参数 请求成功的回调函数
        //第四个参数为 响应数据类型 json
        $.post("listRole",function(msg){
            var str = "";
            $(msg).each(function (i) {
                var r = msg[i];
                str += "<option value='"+r.id+"'>"
                str += r.rolename
                str += "</option>"
            })
            $("#userRole").append(str);
        },"json")
    }

    function bindEvent(){
        $("#add").click(function(){
            //验证

            document.forms[0].submit();
        })


        //校验userCode是否重复
        $("#userCode").blur(function(){
            var usercode = $("#userCode").val();
            if(usercode == null || usercode == ""){
                alert("请输入用户编号");
                return;
            }
            $.post("checkUsercode",{"usercode" : usercode},function(msg){
                if(msg.count == 0){
                    //可用
                    $("#userCode").next("font").html("该用户编码可用").css("color","green");
                }else{
                    //不可用
                    $("#userCode").next("font").html("该用户编码不可使用").css("color","red");

                }
            },"json")
        })
    }
</script>

<%@include file="../foot.jsp"%>